<template>
  <a-card :bordered="false">
    <a-tabs
      :tabBarStyle="{ borderBottom: 'solid 1px #d7d7d7' }"
      v-model:activeKey="activeKey"
      @change="handleTabClick"
      style="
        padding-top: 3px;
        margin-left: -1px;
        width: 95%;
        position: relative;
      "
    >
      <a-tab-pane v-for="item in groupList" :key="item.id" :tab="item.name" />
    </a-tabs>
    <a
      @click="groupEditModule"
      v-wx-role="101302"
      style="position: relative; top: -49px; left: 96%"
    >
      <a-icon type="setting"
    /></a>

    <div class="table-page-search-wrapper" style="margin-top: -20px">
      <a-form layout="horizontal" @keyup.enter.native="searchQuery">
        <!-- 基础信息区域 -->
        <div class="form-section">
          <a-row :gutter="24">
            <a-col :span="6">
              <a-form-item
                label="关键字搜索:"
                prop="keywords"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-input
                  placeholder="资产码、设备名称、品牌、型号、序列号、号码牌"
                  v-model="queryParam.keywords"
                ></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="设备短码:"
                prop="deviceShortCode"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-input
                  v-model="queryParam.deviceShortCode"
                  placeholder="请输入设备短码(例如:1123321,12133)"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="通用名:"
                prop="commonName"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.commonName"
                  placeholder="请选择"
                  show-search
                >
                  <a-select-option
                    v-for="item in commonNameList"
                    :key="item.id"
                    :value="item.id"
                  >
                    {{ item.commonName }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="设备订阅:"
                prop="deviceSubscription"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.deviceSubscription"
                  placeholder="请选择"
                  show-search
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('whetherFlag')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24">
            <a-col :span="6">
              <a-form-item
                label="CFDA"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.cfda"
                  placeholder="请选择CFDA"
                  show-search
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('ishave')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="使用状态"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.activeState"
                  placeholder="请选择使用状态"
                  :disabled="isDisabled.activeState"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('activeState')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="资产状态"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.assetStatus"
                  placeholder="请选择资产状态"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('assetStatus')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="保修状态"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.repairState"
                  placeholder="请选择保修状态"
                  :disabled="isDisabled.repairState"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('repair_state')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24">
            <a-col :span="6">
              <a-form-item
                label="资产编码"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.isAssetCode"
                  placeholder="请选择资产编码"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('assetCode')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="固定资产"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.fixedAssets"
                  placeholder="请选择固定资产"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('fixedAssets')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="有效期"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.period"
                  placeholder="请选择有效期"
                  :disabled="isDisabled.period"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('period')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="类型"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model:value="queryParam.deviceType"
                  style="width: 100%"
                  :tree-data="deviceTypeTree"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  placeholder="请选择类型"
                />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24" v-if="toggleSearchStatus">
            <a-col :span="6">
              <a-form-item
                label="专业分类"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model:value="queryParam.professionalClassificationId"
                  :tree-data="professionalClassificationIdTree"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  placeholder="请选择专业分类"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="当前位置"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-cascader
                  v-model="queryParam.currentLocation"
                  :options="campusBuildingFloorRoomTree"
                  :change-on-select="false"
                  expand-trigger="click"
                  placeholder="请选择当前位置"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="所属科室"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model="queryParam.departmentId"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  :tree-data="departmentTree"
                  placeholder="请选择所属科室"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="使用科室"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model="queryParam.usingDepartmentId"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  :tree-data="departmentTree"
                  placeholder="请选择使用科室"
                />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24" v-if="toggleSearchStatus">
            <a-col :span="6">
              <a-form-item
                label="使用人"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.userName"
                  placeholder="请选择使用人"
                >
                  <a-select-option
                    v-for="item in createByList"
                    :key="item.companyId"
                    :value="item.companyId"
                  >
                    {{ item.companyName }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="资产管理员"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.assetManager"
                  placeholder="请选择资产管理员"
                >
                  <a-select-option
                    v-for="item in createByList"
                    :key="item.companyId"
                    :value="item.companyId"
                  >
                    {{ item.companyName }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="借调情况"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.secondmentSituation"
                  placeholder="请选择借调情况"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('secondmentSituation')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="供应商"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-input
                  v-model="queryParam.supplierName"
                  placeholder="请输入供应商"
                />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24" v-if="toggleSearchStatus">
            <a-col :span="6">
              <a-form-item
                label="进口/国产"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.importedDomestic"
                  placeholder="请选择进口/国产"
                  :disabled="isDisabled.importedDomestic"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('importedDomestic')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="国别"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.differentCountrie"
                  placeholder="请选择国别"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('differentCountrie')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="生产厂商"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-input
                  v-model="queryParam.manufacturerName"
                  placeholder="请输入生产厂商"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="资产价值"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <div class="input-group">
                  <a-input
                    v-model="queryParam.assetValueMin"
                    placeholder="请输入最小值"
                    style="flex: 1"
                    :disabled="isDisabled.assetValueMin"
                  />
                  <span style="line-height: 32px">-</span>
                  <a-input
                    v-model="queryParam.assetValueMax"
                    :disabled="isDisabled.assetValueMin"
                    placeholder="请输入最大值"
                    style="flex: 1"
                  />
                </div>
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24" v-if="toggleSearchStatus">
            <a-col :span="6">
              <a-form-item
                label="RFID部署"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.rfid"
                  placeholder="请选择RFID部署"
                  :disabled="isDisabled.rfid"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('rfidDeployment')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="生产日期"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <div class="date-range-container">
                  <a-range-picker
                    v-model="queryParam.manufactureDate"
                    format="YYYY-MM-DD"
                    @change="manufactureDateChange"
                  />
                </div>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="失效日期"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <div class="date-range-container">
                  <a-range-picker
                    v-model="queryParam.expiringDate"
                    format="YYYY-MM-DD"
                    @change="expiringDateChange"
                  />
                </div>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="采购日期"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <div class="date-range-container">
                  <a-range-picker
                    v-model="queryParam.purchaseDate"
                    format="YYYY-MM-DD"
                    @change="purchaseDateChange"
                  />
                </div>
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24" v-if="toggleSearchStatus">
            <a-col :span="6">
              <a-form-item
                label="验收日期"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <div class="date-range-container">
                  <a-range-picker
                    v-model="queryParam.acceptanceDate"
                    format="YYYY-MM-DD"
                    @change="acceptanceDateChange"
                  />
                </div>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="录入日期"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <div class="date-range-container">
                  <a-range-picker
                    v-model="queryParam.entryDate"
                    format="YYYY-MM-DD"
                    @change="entryDateChange"
                  />
                </div>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="录入人"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.createBy"
                  placeholder="请选择录入人"
                >
                  <a-select-option
                    v-for="item in createByList"
                    :key="item.companyId"
                    :value="item.companyId"
                  >
                    {{ item.companyName }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="录入方式"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.inputMethod"
                  placeholder="请选择录入方式"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('inputMethod')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24" v-if="toggleSearchStatus">
            <a-col :span="6">
              <a-form-item
                label="录入来源"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.enterSource"
                  placeholder="请选择录入来源"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('enterSource')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="管理部门"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-select
                  :showArrow="true"
                  :allowClear="true"
                  v-model="queryParam.administrativeDept"
                  placeholder="请选择管理部门"
                >
                  <a-select-option
                    v-for="item in this.$sysDictOptions('administrativeDept')"
                    :key="item.k"
                    :value="item.k"
                  >
                    {{ item.v }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="器械分类"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model:value="queryParam.deviceClassificationId"
                  :tree-data="deviceClassificationTree"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  placeholder="请选择器械分类"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="强检目录"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model:value="queryParam.mandatoryInspectionCatalogId"
                  :tree-data="mandatoryInspectionCatalogTree"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  placeholder="请选择强检目录"
                />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="24" v-if="toggleSearchStatus">
            <a-col :span="6">
              <a-form-item
                label="政采目录"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model:value="queryParam.politicalProcurementCatalogueId"
                  :tree-data="politicalProcurementCatalogueTree"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  placeholder="请选择政采目录"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="部队通用名"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model:value="queryParam.commonMilitaryNameId"
                  :tree-data="commonMilitaryNameTree"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  placeholder="请选择部队通用名"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="固资分类"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model:value="queryParam.fixedClassificationId"
                  :tree-data="fixedClassificationTree"
                  tree-checkable
                  :treeCheckStrictly="true"
                  allow-clear
                  placeholder="请选择固资分类"
                />
              </a-form-item>
            </a-col>
            <a-col :span="6">
              <a-form-item
                label="高等学校固定资产分类"
                :label-col="{ span: 8 }"
                :wrapper-col="{ span: 16 }"
              >
                <a-tree-select
                  v-model:value="queryParam.fixedAssetClassificationCodeId"
                  :tree-data="fixedAssetClassificationCodeTree"
                  tree-checkable
                  allow-clear
                  :treeCheckStrictly="true"
                  placeholder="请选择高等学校固定资产分类"
                />
              </a-form-item>
            </a-col>
          </a-row>
        </div>

        <!-- 底部查询按钮 -->
        <div class="form-footer">
          <a @click="handleToggleSearch" style="line-height: 35px">
            {{ toggleSearchStatus ? '收起' : '更多条件' }}
            <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
          </a>
          <a-button
            type="primary"
            @click="$refs.table.refresh(true)"
            style="width: 65px; height: 30px; padding-left: 17px"
            >查询</a-button
          >
          <a-button
            @click="
              () => {
                this.$objToReset(queryParam), $refs.table.refresh(true)
              }
            "
            style="
              margin-left: 8px;
              width: 65px;
              height: 30px;
              padding-left: 17px;
            "
            >重置</a-button
          >
          <!-- <a-button>重置</a-button>
          <a-button type="primary">查询</a-button>
          <a-button>导出数据</a-button> -->
        </div>
      </a-form>
      <div class="line"></div>
      <a-button
        @click="$refs.modalEdit.add()"
        type="primary"
        icon="plus"
        v-wx-role="101301"
        style="height: 30px"
        >添加</a-button
      >&nbsp;
      <div class="table-operator">
        <a-dropdown v-if="selectedRowKeys.length > 0">
          <a-menu slot="overlay">
            <a-menu-item>
              <a-popconfirm
                title="确定删除吗?"
                @confirm="() => handleDelete()"
                v-wx-role="101304"
              >
                <a><a-icon type="delete" />删除</a>
              </a-popconfirm>
            </a-menu-item>
          </a-menu>
          <a-button style="margin-left: 8px"
            >批量操作<a-icon type="down"
          /></a-button>
        </a-dropdown>
      </div>
      <!--  -->
      <s-table
        ref="table"
        rowKey="id"
        size="middle"
        :columns="columns"
        :alert="options.alert"
        :scroll="{ x: 3200 }"
        :row-selection="options.rowSelection"
        :data="loadData"
      >
        <template slot="deviceShortCode" slot-scope="text, record">
          <a @click="handleEdit(record)">{{
            text == null || text == '' ? '--' : text
          }}</a>
        </template>
        <template slot="departmentId" slot-scope="text, record">
          {{ getDepartmentId(text) }}
        </template>
        <!-- 录入人 -->
        <template slot="createBy" slot-scope="text, record">
          {{ getCreateByName(text) }}
        </template>

        <template slot="action" slot-scope="text, record">
          <a-popconfirm
            title="确定删除吗?"
            @confirm="() => handleDelete(record.id)"
            v-wx-role="101303"
          >
            <a>删除</a>
          </a-popconfirm>
        </template>
      </s-table>

      <dev-archive-equipment-edit
        ref="modalEdit"
        @ok="modalEditOk"
        @close="modalEditOk"
      ></dev-archive-equipment-edit>
      <dev-archive-equipment-view ref="modalView"></dev-archive-equipment-view>

      <a-drawer
        :maskClosable="true"
        width="75%"
        placement="right"
        :closable="false"
        @close="filterGroupCancel"
        :destroyOnClose="true"
        :visible="filterGroupVisible"
      >
        <dev-archive-filter-group-list
          ref="filterGroupRef"
          @ok="filterGroupEditOk"
          @close="filterGroupCancel"
        ></dev-archive-filter-group-list>
      </a-drawer>
    </div>
  </a-card>
</template>

<script>
import { STable, Ellipsis } from '@/components'
import { deleteAction, postAction, getAction } from '@/api/manage'
import { mixin } from '@/utils/mixin'
import DevArchiveEquipmentEdit from './DevArchiveEquipmentEdit'
import DevArchiveEquipmentView from './DevArchiveEquipmentView'
import { getDepartTree, getCompanyList } from '@/api/api'
import DevArchiveFilterGroupList from '../../devArchive/devArchiveFilterGroup/DevArchiveFilterGroupList.vue'
export default {
  name: 'DevArchiveEquipmentList',
  mixins: [mixin],
  components: {
    STable,
    Ellipsis,
    DevArchiveEquipmentEdit,
    DevArchiveEquipmentView,
    DevArchiveFilterGroupList,
  },
  data() {
    return {
      filterGroupVisible: false,
      createByList: [],
      activeKey: '-1',
      visible: false,
      // 查询条件
      queryParam: {
        deviceShortCode: undefined,
        commonName: undefined,
        cfda: undefined,
        activeState: undefined,
        assetStatus: undefined,
        repairState: undefined,
        assetCode: undefined,
        fixedAssets: undefined,
        period: undefined,
        deviceType: undefined,
        assetCode: undefined,
        currentLocation: undefined,
        departmentId: undefined,
        usingDepartmentId: undefined,
        supplierName: undefined,
        importedDomestic: undefined,
        differentCountrie: undefined,
        manufacturerName: undefined,
        assetValueMin: undefined,
        assetValueMax: undefined,
        purchaseDate: undefined,
        expiringDate: undefined,
        acceptanceDate: undefined,
        entryDate: undefined,
        inputMethod: undefined,
        enterSource: undefined,
        administrativeDept: undefined,
        deviceClassificationId: undefined,
        mandatoryInspectionCatalogId: undefined,
        politicalProcurementCatalogueId: undefined,
        commonMilitaryNameId: undefined,
        fixedClassificationId: undefined,
        fixedAssetClassificationCodeId: undefined,
      },
      isDisabled: {
        commonName: false,
        cfda: false,
        activeState: false,
        assetStatus: false,
        repairState: false,
        assetCode: false,
        fixedAssets: false,
        period: false,
        deviceType: false,
        assetCode: false,
        currentLocation: false,
        departmentId: false,
        usingDepartmentId: false,
        supplierName: false,
        importedDomestic: false,
        differentCountrie: false,
        manufacturerName: false,
        assetValueMin: false,
        assetValueMax: false,
        purchaseDate: false,
        expiringDate: false,
        acceptanceDate: false,
        entryDate: false,
        inputMethod: false,
        enterSource: false,
        administrativeDept: false,
        deviceClassificationId: false,
        mandatoryInspectionCatalogId: false,
        politicalProcurementCatalogueId: false,
        commonMilitaryNameId: false,
        fixedClassificationId: false,
        fixedAssetClassificationCodeId: false,
      },
      // 表头
      // 如果需要字典，那么需要在columns列中加入 customRender: (text) => this.$sysDictFilter(text, 'xxxx')xxxx 为dataIndex
      columns: [
        {
          title: '设备编码',
          dataIndex: 'deviceShortCode',
          fixed: 'left',
          scopedSlots: { customRender: 'deviceShortCode' },
          width: 150,
        },
        {
          title: '资产编码',
          dataIndex: 'assetCode',
          fixed: 'left',
          width: 120,
        },
        {
          title: '设备名称',
          dataIndex: 'deviceName',
          fixed: 'left',
          width: 200,
        },
        {
          title: '通用名',
          dataIndex: 'commonName',
          scopedSlots: { customRender: 'commonName' },
          width: 100,
        },
        {
          title: '使用状态',
          dataIndex: 'activeState',
          customRender: (text) => this.$sysDictFilter(text, 'activeState'),
        },
        {
          title: '保修状态',
          dataIndex: 'repairState',
          customRender: (text) => this.$sysDictFilter(text, 'repair_state'),
        },
        {
          title: '品牌',
          dataIndex: 'bind',
        },
        {
          title: '型号',
          dataIndex: 'model',
        },
        {
          title: '序列号',
          dataIndex: 'serialNumber',
        },
        {
          title: '生产厂商',
          dataIndex: 'manufacturerName',
        },
        // {
        //   title: 'RFID部署',
        //   dataIndex: 'rfid',
        //   customRender: (text) => this.$sysDictFilter(text, 'rfidDeployment'),
        // },
        {
          title: '所属科室',
          dataIndex: 'departmentId',
          scopedSlots: { customRender: 'departmentId' },
        },
        {
          title: '当前位置',
          dataIndex: 'currentLocation',
          scopedSlots: { customRender: 'currentLocation' },
          width: 195,
        },
        {
          title: '供应商',
          dataIndex: 'assetSupplier',
        },
        // {
        //   title: '失效日期',
        //   dataIndex: 'expiringDate',
        //   width: 90,
        // },
        {
          title: '生产日期',
          dataIndex: 'manufactureDate',
          width: 90,
        },
        // {
        //   title: '国别',
        //   dataIndex: 'differentCountrie',
        //   customRender: (text) =>
        //     this.$sysDictFilter(text, 'differentCountrie'),
        // },
        // {
        //   title: '更换配件',
        //   dataIndex: 'replaceParts',
        // },
        {
          title: '采购价格',
          dataIndex: 'purchasePrice',
        },
        // {
        //   title: '联系人',
        //   dataIndex: 'contacts',
        // },
        // {
        //   title: '入库方式',
        //   dataIndex: 'storageMethod',
        // },
        // {
        //   title: '入库单号',
        //   dataIndex: 'warehouseEntryNumber',
        // },
        {
          title: '采购日期',
          dataIndex: 'purchaseDate',
          width: 90,
        },
        {
          title: '唯一识别号',
          dataIndex: 'uniqueIdentificationNumber',
          width: 90,
        },
        // {
        //   title: 'HRP资产编码',
        //   dataIndex: 'hrpAssetCode',
        //   width: 120,
        // },
        // {
        //   title: '甲乙类设备配置征信息-配置证号',
        //   dataIndex: 'configurationCertificateNumber',
        //   width: 220,
        // },
        // {
        //   title: '是否发改资金',
        //   dataIndex: 'isDevelopmentReformFunds',
        //   width: 120,
        // },
        // {
        //   title: '总务类资产盘点',
        //   dataIndex: 'inventoryGeneralAffairsAssets',
        //   width: 120,
        // },
        // {
        //   title: '医疗设备资产盘点',
        //   dataIndex: 'inventoryMedicalEquipmentAssets',
        //   width: 130,
        // },
        // {
        //   title: '房产资产盘点',
        //   dataIndex: 'realEstateAssetInventory',
        //   width: 120,
        // },
        {
          title: '录入人',
          dataIndex: 'createBy',
          scopedSlots: { customRender: 'createBy' },
        },
        {
          title: '录入时间',
          dataIndex: 'createTime',
          width: 150,
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          fixed: 'right',
          scopedSlots: { customRender: 'action' },
        },
      ],
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        console.log('loadData.parameter', parameter)
        if (this.queryParam.politicalProcurementCatalogueId) {
          this.queryParam.politicalProcurementCatalogueIds = JSON.stringify(
            this.queryParam.politicalProcurementCatalogueId
          )
        }

        if (this.queryParam.deviceClassificationId) {
          this.queryParam.deviceClassificationIds = JSON.stringify(
            this.queryParam.deviceClassificationId
          )
        }

        if (this.queryParam.mandatoryInspectionCatalogId) {
          this.queryParam.mandatoryInspectionCatalogIds = JSON.stringify(
            this.queryParam.mandatoryInspectionCatalogId
          )
        }

        if (this.queryParam.commonMilitaryNameId) {
          this.queryParam.commonMilitaryNameIds = JSON.stringify(
            this.queryParam.commonMilitaryNameId
          )
        }

        if (this.queryParam.fixedClassificationId) {
          this.queryParam.fixedClassificationIds = JSON.stringify(
            this.queryParam.fixedClassificationId
          )
        }

        if (this.queryParam.fixedAssetClassificationCodeId) {
          this.queryParam.fixedAssetClassificationCodeIds = JSON.stringify(
            this.queryParam.fixedAssetClassificationCodeId
          )
        }

        if (this.queryParam.deviceType) {
          this.queryParam.deviceTypes = JSON.stringify(
            this.queryParam.deviceType
          )
        }

        if (this.queryParam.professionalClassificationId) {
          this.queryParam.professionalClassificationIds = JSON.stringify(
            this.queryParam.professionalClassificationId
          )
        }

        if (this.queryParam.currentLocation) {
          this.queryParam.currentLocations =
            this.queryParam.currentLocation + ''
        }

        if (this.queryParam.departmentId) {
          this.queryParam.departmentIds = JSON.stringify(
            this.queryParam.departmentId
          )
        }

        if (this.queryParam.usingDepartmentId) {
          this.queryParam.usingDepartmentIds = JSON.stringify(
            this.queryParam.usingDepartmentId
          )
        }

        if (this.queryParam.manufactureDate) {
          this.queryParam.manufactureDates = JSON.stringify(
            this.queryParam.manufactureDate
          )
        }

        return postAction(
          this.url.list,
          Object.assign(parameter, this.queryParam)
        ).then((res) => {
          return res.result
        })
      },
      deviceTypeTree: [],
      professionalClassificationIdTree: [],
      deviceClassificationTree: [],
      mandatoryInspectionCatalogTree: [],
      politicalProcurementCatalogueTree: [],
      commonMilitaryNameTree: [],
      fixedClassificationTree: [],
      fixedAssetClassificationCodeTree: [],
      campusBuildingFloorRoomTree: [],
      departmentTree: [],
      commonNameList: [],
      selectedRowKeys: [],
      options: {
        alert: {
          clear: () => {
            this.selectedRowKeys = []
          },
        },
        rowSelection: {
          selectedRowKeys: this.selectedRowKeys,
          onChange: this.onSelectChange,
          type: 'checkbox',
        },
      },
      groupList: [],
      url: {
        list: '/system/devArchiveEquipment/list',
        delete: '/system/devArchiveEquipment/delete',
        getListFilterGroupStatistic:
          '/system/devArchiveEquipment/getListFilterGroupStatistic',
        getDeviceTypeTree: '/system/ktree/tree',
        getprofessionalClassificationIdTree:
          '/system/devProfessionalClassification/tree',
        getClassificationTree: '/system/devArchiveDeviceClassification/tree',
        getMandatoryInspectionCatalogTree:
          '/system/devArchiveMandatoryInspectionCatalog/tree',
        getPoliticalProcurementCatalogueTree:
          '/system/devArchivePoliticalProcurementCatalogue/tree',
        getCommonMilitaryNameTree: '/system/devArchiveCommonMilitaryName/tree',
        getFixedClassificationTree:
          '/system/devArchiveFixedClassification/tree',
        getFixedAssetClassificationCodeTree:
          '/system/devArchiveFixedAssetClassificationCode/tree',
        getCampusBuildingFloorRoomTree:
          '/system/devCampusBuildingFloorRoom/listTree',
        getDevArchiveCommonNameList: '/system/devArchiveCommonName/getList',
      },
      toggleSearchStatus: false,
    }
  },
  computed: {},
  created() {
    this.getUserList()
    this.getGroupList()
    this.getCampusBuildingFloorRoom()
    // 专业分类
    this.getprofessionalClassificationId()
    //使用科室
    this.getDepartment()
    //器械分类
    this.getClassification()
    //强检目录
    this.getMandatoryInspectionCatalog()
    //政采目录
    this.getPoliticalProcurementCatalogue()
    //政府通用名
    this.getCommonMilitaryName()
    //固资分类
    this.getFixedClassification()
    //固定资产分类与代码
    this.getFixedAssetClassificationCode()
    //设备类型
    this.getDeviceType()
  },
  methods: {
    entryDateChange(value, dateString) {
      this.queryParam.startEntryDate = dateString[0]
      this.queryParam.endEntryDate = dateString[1]
    },
    acceptanceDateChange(value, dateString) {
      this.queryParam.startAcceptanceDate = dateString[0]
      this.queryParam.endAcceptanceDate = dateString[1]
    },
    purchaseDateChange(value, dateString) {
      this.queryParam.startPurchaseDate = dateString[0]
      this.queryParam.endPurchaseDate = dateString[1]
    },
    expiringDateChange(value, dateString) {
      this.queryParam.startExpiringDate = dateString[0]
      this.queryParam.endExpiringDate = dateString[1]
    },
    manufactureDateChange(value, dateString) {
      this.queryParam.startManufactureDate = dateString[0]
      this.queryParam.endManufactureDate = dateString[1]
    },
    getUserList() {
      // 加载数据方法 必须为 Promise 对象
      var parameter = { pageNo: 1, pageSize: 1000000 }
      getCompanyList(Object.assign(parameter, this.queryParam)).then((res) => {
        this.createByList = res.result.data.records
      })
    },
    getDepartmentId(text) {
      console.log('this.departmentTree;>>', this.departmentTree)
    },

    getCreateByName(text) {
      var obj = this.createByList.filter((aa) => aa.companyId == text)[0]
      if (obj == null) {
        return '--'
      }
      return obj.companyName
    },
    handleToggleSearch() {
      this.toggleSearchStatus = !this.toggleSearchStatus
    },

    //位置
    getCampusBuildingFloorRoom() {
      getAction(this.url.getCampusBuildingFloorRoomTree).then((res) => {
        this.campusBuildingFloorRoomTree = res.result.data
      })
    },
    //固定资产分类与代码
    getFixedAssetClassificationCode() {
      getAction(this.url.getFixedAssetClassificationCodeTree).then((res) => {
        this.fixedAssetClassificationCodeTree = res.result.data
      })
    },
    //固资分类
    getFixedClassification() {
      getAction(this.url.getFixedClassificationTree).then((res) => {
        this.fixedClassificationTree = res.result.data
      })
    },
    //政府通用名
    getCommonMilitaryName() {
      getAction(this.url.getCommonMilitaryNameTree).then((res) => {
        this.commonMilitaryNameTree = res.result.data
      })
    },
    //政采目录
    getPoliticalProcurementCatalogue() {
      getAction(this.url.getPoliticalProcurementCatalogueTree).then((res) => {
        this.politicalProcurementCatalogueTree = res.result.data
      })
    },
    //强检目录
    getMandatoryInspectionCatalog() {
      getAction(this.url.getMandatoryInspectionCatalogTree).then((res) => {
        this.mandatoryInspectionCatalogTree = res.result.data
      })
    },
    //器械分类
    getClassification() {
      getAction(this.url.getClassificationTree).then((res) => {
        this.deviceClassificationTree = res.result.data
      })
    },
    //使用科室
    getDepartment() {
      getDepartTree().then((res) => {
        this.departmentTree = res.result.data
      })
    },
    //设备类型
    getDeviceType() {
      getAction(this.url.getDeviceTypeTree, {}).then((res) => {
        this.deviceTypeTree = res.result.data
      })
    },
    //专业分类
    getprofessionalClassificationId() {
      getAction(this.url.getprofessionalClassificationIdTree, {}).then(
        (res) => {
          this.professionalClassificationIdTree = res.result.data
        }
      )
    },
    getFilterSelectName(text) {
      var selectContent = []
      var obj = JSON.parse(text)
      for (const key in obj) {
        console.log('key>>', key) // "assetStatus"
        // 如果你只需要第一个key，可以在这里break
        // 判断该key对应的值是否为空
        if (obj[key]) {
          console.log(`${key}的值不为空`)
        }

        this.queryParam[key] = obj[key]
        this.isDisabled[key] = true
      }
      console.log('selectContent2:', selectContent)
      return [...new Set(selectContent)]
    },
    handleTabClick(key) {
      // this.queryParam.isSave = key
      this.queryParam = {}
      this.isDisabled = {}
      this.getGroupList()
      if (key != '-1') {
        if (this.groupList) {
          var groupObj = this.groupList.filter((aa) => aa.id == key)[0]

          this.getFilterSelectName(groupObj.data)
          console.log(this.queryParam)
        }
      }
      this.$refs.table.refresh(true)
    },
    getGroupList() {
      getAction(this.url.getListFilterGroupStatistic).then((res) => {
        this.groupList = res.result.data
      })
    },
    groupEditModule() {
      this.filterGroupVisible = true
    },
    filterGroupEditOk(val) {
      this.filterGroupVisible = false
      this.getGroupList()
    },
    filterGroupCancel() {
      this.filterGroupVisible = false
      this.getGroupList()
    },
    // 删除
    handleDelete(record) {
      if (!record) {
        // 如果没有传入，那么批量删除
        record = this.selectedRowKeys.join(',')
      }
      deleteAction(this.url.delete, { ids: record }).then((resp) => {
        this.$message.success('删除成功!')
        this.$refs.table.refresh(true)
      })
    },
    // 用户编辑
    handleEdit(record) {
      record.type = '0'
      this.$refs.modalEdit.edit(record)
    },
    searchQuery() {
      this.$refs.table.refresh(true)
    },
    // 保存刷新
    modalEditOk() {
      this.$refs.table.refresh()
    },
    // 查看
    handelView(record) {
      this.$refs.modalView.show(record)
    },
    //开启选择
    onSelectChange(selectedRowKeys) {
      console.log('selectedRowKeys changed: ', selectedRowKeys)
      this.selectedRowKeys = selectedRowKeys
    },
  },
  watch: {},
}
</script>
<style scoped>
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    'PingFang SC', 'Microsoft YaHei', sans-serif;
  background-color: #f0f2f5;
  color: #333;
  margin: 0;
  padding: 20px;
}

.ant-tabs >>> .ant-tabs-tab {
  font-size: 16px !important;
}

.ant-tabs {
  width: 99% !important;
}

.ant-form-item {
  margin-bottom: 10px !important;
}

.line {
  width: 100%;
  height: 1px;
  margin: 10px 0;
  background-color: #d6dbe0;
}

.container {
  max-width: 1600px;
  margin: 0 auto;
  background: white;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  padding: 20px 24px;
}

.header {
  margin-bottom: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
}

.system-title {
  font-size: 24px;
  font-weight: 600;
  color: #1d39c4;
  letter-spacing: 1px;
}

.form-section {
  padding: 0% 1% 0% 0%;
  margin-left: -2.5%;
  /* background: #fafafa; */
  /* padding: 16px 20px;
  border-radius: 4px;
  margin-bottom: 24px; */
  /* border: 1px solid #f0f0f0; */
}

.section-title {
  font-weight: 600;
  margin-bottom: 16px;
  color: #2f54eb;
  position: relative;
  padding-left: 12px;
  font-size: 16px;
}

.section-title:before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 5px;
  height: 18px;
  background: #2f54eb;
  border-radius: 3px;
}

.date-range-container {
  display: flex;
  gap: 8px;
}

.date-range-container .ant-picker {
  flex: 1;
}

.form-footer {
  display: flex;
  justify-content: flex-end;

  gap: 16px;
}

.ant-row {
  /* margin-bottom: 14px; */
}

.ant-input,
.ant-select-selector,
.ant-picker {
  border-radius: 4px;
  border: 1px solid #d9d9d9;
}

.ant-select-selector {
  padding: 1px 11px;
}

.ant-col .ant-form-item-label {
  text-align: right;
  padding-right: 8px;
}

.ant-btn {
  border-radius: 4px;
  height: 34px;
  padding: 0 20px;
  font-weight: 500;
}

.ant-btn-primary {
  background: #1890ff;
  border-color: #1890ff;
}

.ant-btn-default {
  border-color: #d9d9d9;
  color: #333;
}

.value-range {
  display: flex;
  align-items: center;
  gap: 8px;
}

.form-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.page-action {
  display: flex;
  gap: 12px;
}

.search-btn {
  background: #1890ff;
  color: white;
}

.custom-label {
  font-size: 14px;
  color: #595959;
  white-space: nowrap;
}

.input-group {
  display: flex;
  gap: 10px;
}

/* .form-footer .ant-btn:nth-child(2) {
  background: #096dd9;
  border-color: #096dd9;
} */
@media (max-width: 1400px) {
  .container {
    padding: 15px;
  }
}

.ant-card-body {
  padding: 10px !important;
}
</style>
